<script setup>
import {useLoginStore} from "./store/user.js"; // export const 导出 需要使用原名称及{}导入
import useUserStore from "./store/user.js"; // export default 导出 不用{},也可以不用原名称导入

const loginStore = useLoginStore()
const userStore = useUserStore()
console.log(sessionStorage.getItem("login"))

function set() {
    // 修改 状态 插件会自动修改存储在 sessionStorage 中的值
    loginStore.setLogin({
        username: 'zs',
        password: '123456'
    })
    console.log(loginStore.getLogin)
}

console.log(localStorage.getItem("username"))
function change() {
    userStore.setName('张三')
}
</script>

<template>
    {{ loginStore.getLogin }}
    name: {{ userStore.name }}
    age: {{ userStore.age }}
    <button @click="set">登录</button>
    <button @click="change">修改用户名</button>
</template>

<style scoped>
.logo {
    height: 6em;
    padding: 1.5em;
    will-change: filter;
    transition: filter 300ms;
}

.logo:hover {
    filter: drop-shadow(0 0 2em #646cffaa);
}

.logo.vue:hover {
    filter: drop-shadow(0 0 2em #42b883aa);
}
</style>
